<template>
    <div>
        <a-modal
            :title="currentData.modalTitle"
            :visible="visible"
            @ok="visible = false"
            @cancel="visible = false"
            cancelText="关闭"
            :width="1100"
            :footer="null"
            class="selectionRecord-modal-box"
            :dialogStyle="{top:'40px'}"
        >
            <template slot="footer">
                <div style="display: flex;justify-content: flex-end;">
                    <a-button type="primary" @click="visible = false">关闭</a-button>
                </div>
            </template>
            <commpVxeTable
                :key="manualKey"
                :isCanWrap="true"
                :canWrapTableHeight="320"
                :config="manualdataTableConfig" 
                :columns="manualcolumnsVxe" 
                :formItem="[]"
                @checkboxChange="checkboxChange"
                ref="acceptanceRegistrationRef"
            >
                <template v-slot:fjcyxm_default="{row}" data-desc="姓名">
                    <span style="padding-right: 21;" v-if="row.fjcyxm&&row.fjcyxm.length == 2">
                        <span v-for="(trem,tI) in row.fjcyxm.split('')" :key="tI" >
                            {{trem}}
                            <span v-if="tI+1 !== row.fjcyxm.split('').length">&nbsp;&nbsp;</span>
                        </span>
                    </span>
                    <span style="padding-right: 21;" v-else>{{ row.fjcyxm }}</span>
                </template>
                <template v-slot:fssk_default="{row}" data-desc="所属库">
                    <span style="padding-right: 21;" v-if="row.fssk&&row.fssk.length == 2">
                        <span v-for="(trem,tI) in row.fssk.split('')" :key="tI" >
                            {{trem}}
                            <span v-if="tI+1 !== row.fssk.split('').length">&nbsp;&nbsp;</span>
                        </span>
                    </span>
                    <span style="padding-right: 21;" v-else>{{ row.fssk }}</span>
                </template>
                <template v-slot:fssqy_default="{row}" data-desc="所属区域">
                    <span style="padding-right: 21;" v-if="row.fssqy&&row.fssqy.length == 2">
                        <span v-for="(trem,tI) in row.fssqy.split('')" :key="tI" >
                            {{trem}}
                            <span v-if="tI+1 !== row.fssqy.split('').length">&nbsp;&nbsp;</span>
                        </span>
                    </span>
                    <span style="padding-right: 21;" v-else>{{ row.fssqy }}</span>
                </template>
                <template v-slot:fxpfs_default="{row}">
                    <div style="display: flex;align-items: center;justify-content: center;">
                        <a-tooltip placement="topLeft" v-if="row.fxpfs == '手动指定'" >
                            <template slot="title">
                            <span>{{ row.fbz }}</span>
                            </template>
                            <a-icon style="font-size: 18px;color: #5ca3e5;margin-right: 5px;" type="info-circle" />
                        </a-tooltip>
                        <span>{{ row.fxpfs }}</span>
                    </div>
                </template>
                <template v-slot:fsftyxp_default="{row}">
                    <div style="display: flex;align-items: center;justify-content: center;">
                        <a-tooltip placement="topLeft" v-if="row.fsftyxp == '不同意'" >
                            <template slot="title">
                            <span>{{ row.fbtyyy }}</span>
                            </template>
                            <a-icon style="font-size: 18px;color: #5ca3e5;margin-right: 5px;" type="info-circle" />
                        </a-tooltip>
                        <span>{{ row.fsftyxp }}</span>
                    </div>
                </template>
                
                <template v-slot:qkyy_default="{row}">
                    <span v-if="row.fsftyxp == '未处理'">
                        {{ row.fbz }}
                    </span>
                </template>
                <template v-slot:fsmszt_default="{row}" data-desc="是否发送短信">
                    <div style="display: flex;align-items: center;justify-content: center;">
                        <a-tooltip placement="topLeft" v-if="row.fsmszt == '是'" >
                            <template slot="title">
                            <span>{{ row.fdqrdxnr }}</span>
                            </template>
                            <a-icon style="font-size: 18px;color: #5ca3e5;margin-right: 5px;" type="info-circle" />
                        </a-tooltip>
                        
                        <span>{{ row.fsmszt }}</span>
                    </div>
                </template>
                <template v-slot:fjctzdxzt_default="{row}" data-desc="是否发送短信">
                    <div style="display: flex;align-items: center;justify-content: center;">
                        <a-tooltip placement="topLeft" v-if="row.fjctzdxzt == '是'" >
                            <template slot="title">
                            <span>{{ row.fjctzdxnr }}</span>
                            </template>
                            <a-icon style="font-size: 18px;color: #5ca3e5;margin-right: 5px;" type="info-circle" />
                        </a-tooltip>
                        
                        <span>{{ row.fjctzdxzt }}</span>
                    </div>
                </template>
                
                <template v-slot:fxrfs_default="{row}" data-desc="是否发送短信">
                    <div style="display: flex;align-items: center;justify-content: center;">
                        <a-tooltip placement="topLeft" v-if="row.fxrfs == '手动指定'" >
                            <template slot="title">
                            <span>{{ row.fbz }}</span>
                            </template>
                            <a-icon style="font-size: 18px;color: #5ca3e5;margin-right: 5px;" type="info-circle" />
                        </a-tooltip>
                        
                        <span>{{ row.fxrfs }}</span>
                    </div>
                </template>
                
            </commpVxeTable>
        </a-modal>
    </div>
</template>
<script>
import commpVxeTable from '@/components/commp-vxe-table/commp-vxe-table.vue'
import assessCheckApi from './service/api'
export default {
    components:{
        commpVxeTable,
    },
    props:{

    },
    data(){
        return{
            visible:false,
            manualKey:null,
            manualformItem:[
                {
                    label: '真实姓名',
                    model: 'realname',
                }
            ],
            manualcolumnsVxe:[],
            manualcolumnsVxe1:[{
                title: '姓名', //列头显示文字
                field: 'fjcyxm',
                // width: 80,
                titleInterval:true,
                slots: {
                // 使用插槽模板渲染
                    header:'fjcyxm_header',
                    default:'fjcyxm_default',
                },
                width: 66,
            },{
                title: '工作单位', //列头显示文字
                field: 'fgzdw',
                // align:'left'
                // width:180,
            },{
                title: '所属库', //列头显示文字
                field: 'fssk',
                slots: {
                    default:'fssk_default',
                },
                width: 66
                // width:95,
            },{
                title: '所属区域', //列头显示文字
                field: 'fssqy',
                slots: {
                    default:'fssqy_default',
                },
                width: 76
                // width:115,
            },{
                title: '选择方式', //列头显示文字
                field: 'fxpfs',
                width: 107,
                slots: {
                    default:'fxpfs_default',
                },
            },
            // {
            //     title: '手动选择原因', //列头显示文字
            //     field: 'fbz',
            // },
            {
                title: '是否同意', //列头显示文字
                field: 'fsftyxp',
                width: 96,
                slots: {
                    default:'fsftyxp_default',
                },
            },
            // {
            //     title: '不同意原因', //列头显示文字
            //     field: 'fbtyyy',
            // },
            {
                title: '发送确认短信时间', //列头显示文字
                field: 'fsmssj',
                width: 104,
            },{
                title: '是否发送确认短信',
                field: 'fsmszt',
                width: 78,
                slots: {
                    default:'fsmszt_default',
                },
                 
            },{
                title: '发送廉政短信时间', //列头显示文字
                field: 'fjctzdxsj',
                width: 104,
            },{
                title: '是否发送廉政短信', //列头显示文字
                field: 'fjctzdxzt',
                width: 78,
                slots: {
                    default:'fjctzdxzt_default',
                },
            },{
                title: '备注', //列头显示文字
                field: 'qkyy',
                slots: {
                    default:'qkyy_default',
                },
            },
            // ,{
            //     title: '短信内容',
            //     field: 'fdqrdxnr',
            // }
            ], 
            manualcolumnsVxe2:[{
                title: '组长人数', //列头显示文字
                field: 'fzzrs',
                width: 85,
            },{
                title: '组员人数', //列头显示文字
                field: 'fzyrs',
                width: 85,
            },{
                title: '预备审评员人数', //列头显示文字
                field: 'fybrs',
                width: 85,
            },{
                title: '回避区域', //列头显示文字
                field: 'hbqy',
            },{
                title: '专业特长',
                field: 'zytc',
            },{
                title: '选择方式', //列头显示文字
                field: 'fxrfs',
                slots: {
                    default:'fxrfs_default',
                },
            }
            // ,{
            //     title: '手动选择原因', //列头显示文字
            //     field: 'fbz',
            // }
            // ,{
            //     title: '发送短信时间', //列头显示文字
            //     field: 'fsmssj',
            // },{
            //     title: '是否发送确认短信',
            //     field: 'fsmszt',
            //     width: 78,
            //     slots: {
            //         default:'fsmszt_default',
            //     },
            // }
            // ,{
            //     title: '短信内容',
            //     field: 'fdqrdxnr',
            // }
            ], 
            manualdataTableConfig:{
                api: assessCheckApi.commonqueryJcyAllXpPageList,
                rowId: 'id',
                fywflcode:'001002',
                height:window.innerHeight - 230,
                paramet:{},
                isIdeaText:'',
            },
            selectArr:[],
            currentData:{},
            selectData:{},
        }
    },
    watch:{

    },
    mounted(){
        
    },
    methods:{
        getData(val){
            this.currentData = val
            if(val.modalTitle == '抽选人员记录'){
                this.manualdataTableConfig.paramet={...val}
                this.manualdataTableConfig.api = assessCheckApi.commonqueryJcyAllXpPageList
                this.manualcolumnsVxe = this.manualcolumnsVxe1
            }else{
                this.manualdataTableConfig.paramet={...val}
                this.manualdataTableConfig.api = assessCheckApi.ybmjhqueryXptjjlList
                this.manualcolumnsVxe = this.manualcolumnsVxe2
            }
            
            this.manualKey = Date.now()
        },
        checkboxChange(val){
            //console.log(val)
        },
        handleOk(){
        }
    }
}
</script>
<style lang="less">
.selectionRecord-modal-box{
    .ant-modal-body{
        padding: 8px;
    }
}
</style>